import {defineStore} from 'pinia'
import {computed, reactive, Ref, ref, UnwrapRef} from "vue";

// 你可以对 `defineStore()` 的返回值进行任意命名，
// 但最好使用 store 的名字，同时以 `use` 开头且以 `Store` 结尾。
// (比如 `useUserStore`，`useCartStore`，`useProductStore`)
// 第一个参数是你的应用中 Store 的唯一 ID。
// export const useStore = defineStore('main', {
//     // 其他配置...
//     state:()=>{
//         return{
//
//         }
//     },
//     getters:{
//
//     },
//     actions:{
//
//     }
// });

export const useStore = defineStore('main', () => {
    // ref() 就是 state 属性
    // computed() 就是 getters
    // function() 就是 actions

    // const count:Ref<UnwrapRef<number>> = ref(0)
    const count = ref(0);
    const users = reactive([
        {
            name: 'user0',
            gender: 0
        },
        {
            name: 'user1',
            gender: 1
        },
        {
            name: 'user2',
            gender: 0
        },
        {
            name: 'user3',
            gender: 1
        },
        {
            name: 'user4',
            gender: 0
        },
    ]);
    const gender = ref(-1);

    function increment() {
        count.value++
    }

    function updateCount(n: number) {
        count.value += n;
    }

    const persons = computed(function () {
        return gender.value != -1 ? users.filter(user => user.gender == gender.value) : users;
    });

    function updateGender(sex: number) {
        gender.value = sex
    }


    return {count, increment, updateCount, persons, updateGender}
})